<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>品牌管理</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../plugins/adminLTE/css/AdminLTE.css">
    <link rel="stylesheet" href="../plugins/adminLTE/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="../css/style.css">
	<script src="../plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script src="../plugins/bootstrap/js/bootstrap.min.js"></script>

    
</head>
<body class="hold-transition skin-red sidebar-mini">
  <!-- .box-body -->
    <div class="box-header with-border">
        <h3 class="box-title">品牌管理</h3>
    </div>

    <div class="box-body">
        <!-- 数据表格 -->
        <div class="table-box">
            <!--工具栏-->
            <div class="pull-left">
                <div class="form-group form-inline">
                    <div class="btn-group">
                        <button type="button" onclick="addBrandList()" class="btn btn-default" title="新建" data-toggle="modal" data-target="#editModal" ><i class="fa fa-file-o"></i> 新建</button>
                        <button type="button" class="btn btn-default" title="修改" data-toggle="modal" data-target="#aditModal" ><i class="fa fa-file-o"></i> 修改</button>
                        <button type="button" class="btn btn-default" title="删除" onclick="deleteBatch()"><i class="fa fa-trash-o"></i> 删除</button>
                        <button type="button" class="btn btn-default" title="刷新" onclick="window.location.reload();"><i class="fa fa-refresh"></i> 刷新</button>
                    </div>
                </div>
            </div>
            <div class="box-tools pull-right">
                <div class="has-feedback">

                </div>
            </div>
            <!--工具栏/-->
              <!--数据列表-->
            <div id="brandTable">
                <!--品牌信息展示拼接-->
            </div>
            <!--引入分页-->
            <div th:replace="common/common :: foot"></div>
            <!--数据列表/-->
        </div>
        <!-- 数据表格 /-->
     </div>
    <!-- /.box-body -->
         
<!-- 编辑窗口 -->

<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog" >
	<div class="modal-content">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">品牌编辑</h3>
		</div>
		<div class="modal-body">
            <form id="addForm">
                <table class="table table-bordered table-striped"  width="800px">
                    <tr>
                        <td>品牌名称</td>
                        <td><input  name="name" class="form-control" placeholder="品牌名称" >  </td>
                    </tr>
                    <tr>
                        <td>首字母</td>
                        <td><input  name="firstChar" class="form-control" placeholder="首字母">  </td>
                    </tr>
                 </table>
            </form>
		</div>
		<div class="modal-footer">						
			<button class="btn btn-success" data-dismiss="modal" aria-hidden="true" onclick="insertBrand()">保存</button>
			<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>
		</div>
	  </div>
	</div>
</div>
 <!--修改页面-->
  <div id="updateBrandList"></div>

	<script>
		$(function () {
            getData();
		})
        //品牌信息展示页面拼接
		function getData(){
			$.ajax({
				url:"/brandController/getBrandInfo",
				type:"get",
				data : $("#OneForm").serialize(),
				//data:{pageNum:$("#pageNumber").val(),pageSize:$("#pageSize").val()},
				dataType:"json",
				async:false,
				success:function(page){
					var result=page.data.result;
					console.log(result);
					var info = "";
					info += '<table id="dataList" class="table table-bordered table-striped table-hover dataTable">';
					info += '<thead>';
					info += '<tr>';
					info += '<th class="" style="padding-right:0px">';
					info += '<input id="selall" type="checkbox" class="icheckbox_square-blue">';
					info += '</th>';
					info += '<th class="sorting_asc">品牌ID</th>';
					info += '<th class="sorting">品牌名称</th>';
					info += '<th class="sorting">品牌首字母</th>';
					info += '<th class="text-center">操作</th>';
					info += '</tr>';
					info += '</thead>';
					info += '<tbody>';
					$(result).each(function (i,e) {
						info+= '<tr>';
						info+= '<td><input  type="checkbox" value="'+e["id"]+'" name="brandCheckbox"></td>';
						info+= '<td>'+e['id']+'</td>';
						info+= '<td>'+e['name']+'</td>';
						info+= '<td>'+e['firstChar']+'</td>';
						info+= '<td class="text-center">';
						info+= '<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" onclick="updateBrandInfo('+e["id"]+')"  >修改</button>';
						info+= '</td>';
						info+= '</tr>';
					})
					info += '</tbody>';
					info += '</table>';
					$("#brandTable").html(info);
                    pageInstall(page.data);
				},
				error:function(){
					toastr.error("系统异常,请联系客服处理");
				}
			})
		}
        //品牌信息增加页面
        function insertBrand(){
            $.ajax({
                url:"/brandController/insertBrand",
                type:"post",
                data:$("#addForm").serialize(),
                dataType:"json",
                async:false,
                success:function(result){
                    if (result.code == 200) {
                        alert("增加成功");
                        window.location.reload();
                    }
                },
                error:function(){
                    toastr.error("系统异常,请联系客服处理");
                }
            })
        }
        //品牌修改回显页面
        function updateBrandInfo(id){
            $.ajax({
                url:"/brandController/updateBrandInfo?id="+id,
                type:"post",
                //data:$("#updateForm").serialize(),
                dataType:"json",
                async:false,
                success:function(result){
                    var brand = result.data;
                    var info = "";
                    info += '<div class="modal fade" id="aditModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">';
                    info += '<div class="modal-dialog" >';
                    info += '<div class="modal-content">';
                    info += '<div class="modal-header">';
                    info += '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>';
                    info += '<h3 id="myModalLabel2">品牌编辑</h3>';
                    info += '</div>';
                    info += '<div class="modal-body">';
                    info += '<form id="updateBrand">';
                    info += '<table class="table table-bordered table-striped"  width="800px">';
                    info += '<tr>';
                    info += '<td><input  type="hidden" class="form-control" name="id"  value="'+brand["id"]+'">  </td>';
                    info += '/<tr>';
                    info += '<tr>';
                    info += '<td>品牌名称</td>';
                    info += '<td><input  class="form-control" placeholder="品牌名称" name="name" value="'+brand["name"]+'">  </td>';
                    info += '</tr>';
                    info += '<tr>';
                    info += '<td>首字母</td>';
                    info += '<td><input  class="form-control" placeholder="首字母" name="firstChar" value="'+brand["firstChar"]+'">  </td>';
                    info += '</tr>';
                    info += '</table>';
                    info += '</div>';
                    info += '<div class="modal-footer">';
                    info += '<button class="btn btn-success" data-dismiss="modal" aria-hidden="true" onclick="updateBrand()">修改</button>';
                    info += '<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>';
                    info += '</div>';
                    info += '</div>';
                    info += '</div>';
                    info += '</div>';
                    $("#updateBrandList").html(info);

                },
                error:function(){
                    toastr.error("系统异常,请联系客服处理");
                }
            })
        }
        //品牌修改页面
        function updateBrand(){
            $.ajax({
                url:"/brandController/updateBrand",
                type:"post",
                data:$("#updateBrand").serialize(),
                dataType:"json",
                async:false,
                success:function(result){
                    if (result.code == 200) {
                        alert("修改成功");
                        window.location.reload();
                    }
                },
                error:function(){
                    toastr.error("系统异常,请联系客服处理");
                }
            })
        }

        //品牌批量删除
        function deleteBatch() {
            var ids = [];
            var boxs = $("[type=checkbox]:checked");
            for (var i = 0; i < boxs.length; i++) {
                ids.push(boxs[i].value);
            }
            alert(ids);
            if(ids.length <= 0){
                toastr.error("请选择需要删除的数据");
                return;
            }
            if (confirm("是否确认删除?")){
                $.ajax({
                    url:"/brandController/deleteBatch",
                    type:"post",
                    data:{ids:ids},
                    dataType:"json",
                    async:true,
                    success:function (result) {
                        if (result == 1){
                            toastr.success("删除成功");
                            window.location.reload();
                        } else {
                            toastr.error("删除失败");
                        }
                    },
                    error:function(result){
                        toastr.error("系统异常,请联系客服处理");
                    }
                })
            }
        }

	</script>
</body>
</html>